
import { _decorator, Component, Node, tween, UIOpacity, instantiate, RichText, Size, UITransform, size, NodePool } from 'cc';
import { App } from '../../App';
import { EventConst, Location } from '../Common';
import MultiPlug from './MultiPlug';
const { ccclass, property } = _decorator;

/**
 * Predefined variables
 * Name = Tips
 * DateTime = Fri Dec 24 2021 18:26:24 GMT+0800 (中国标准时间)
 * Author = yang839
 * FileBasename = Tips.ts
 * FileBasenameNoExtension = Tips
 * URL = db://assets/src/core/components/Tips.ts
 * ManualUrl = https://docs.cocos.com/creator/3.4/manual/zh/
 *
 */
 interface Msg{
     text:string,
     delay:number,
     local:Location,
     tipsNode:Node,
 }
@ccclass('Tips')
export class Tips extends Component {
    @property({type:Node})
    tipsNode:Node = null;

    private _msgArray:Array<Msg> = null;
    private _parent:Node = null;
    private _tipsPool:NodePool = null;

    /**
     * init
     */
    public init() {
        this._parent = this.tipsNode.parent;
        this._msgArray = new Array<Msg>();
        this._tipsPool = new NodePool();
        for (let i = 0; i < 10; ++i)this._tipsPool.put(instantiate(this.tipsNode));

        App.Event.on(EventConst.POP_TIPS,(txt: string,local:Location,delay:number)=>{
            if (App.isEmpty(txt)) return ;
            const it:Msg = {
                text:txt,
                delay:(isNaN(delay) || delay < 5) && 5,
                local:App.isValid(Location[local]) ? local : Location.Top,
                tipsNode:this._tipsPool.get() || instantiate(this.tipsNode)
            };
            if (this._msgArray.length > 0){
                this._msgArray.push(it);
                return ;
            }
            this._pop(it);
        },this);
    }

    start () {
        // [3]
    }
    
    private _pop(one:Msg) {
        const opa:UIOpacity = one.tipsNode.getComponent(UIOpacity) || one.tipsNode.addComponent(UIOpacity);
        opa.opacity = 0;
        one.tipsNode.getComponent(MultiPlug).setValue(one.local === Location.Top ? 0 : 1);
        const lbl:RichText = one.tipsNode.getChildByName('lblText').getComponent(RichText);
        lbl.string = one.text.indexOf('<') === -1 ? `<color=#ffffff>${one.text}</color>`:one.text;
        const sz:Size = lbl.getComponent(UITransform).contentSize;
        if (sz.width+50 > one.tipsNode.getComponent(UITransform).contentSize.width){
            sz.width += 50;
            App.contentSize(this.tipsNode,sz);
        }
        one.tipsNode.setPosition(App.locationToPos(one.local));
        one.tipsNode.parent = this._parent;
        one.tipsNode.active = true;
        tween(opa).stop();
        tween(opa)
        .to(0.1,{opacity:255})
        .call(()=>{
            //tween(one.tipsNode).call
        }).delay(one.delay).to(0.2,{opacity:0}).call(()=>{
            this._tipsPool.put(one.tipsNode);
            if (this._msgArray.length < 1) {
                tween(this.tipsNode).stop();
            } else {
                this._pop(this._msgArray.shift());
            }
        }).start();
    }
}
